<!DOCTYPE html>
<html>
<head>
  <meta charset="utf-8">
  <title>layui</title>
  <meta name="renderer" content="webkit">
  <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
  <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
  <link rel="stylesheet" href="../plugin/layui-v2.2.5/layui/css/layui.css">
</head>
<body>  
  <div align="center" style="float: left;width: 50%;height: 100%;">
    <fieldset class="layui-elem-field">
      <legend>个人信息</legend>
      <div class="layui-field-box" style="height: 250px">
        <button class="layui-btn layui-btn-primary layui-btn-sm" id="edit_person" style="float: right;"><i class="layui-icon">&#xe642;</i></button>
        <img src="" class="layui-img" style="width: 100px;height: 100px" id="user_img">
        <table class="layui-table" id="teacher-info" style="width: 70%">
          <tr>
            <td>工号</td>
            <td id="personal_workId"></td>
          </tr>
          <tr>
            <td>姓名</td>
            <td id="personal_name"></td>
          </tr>
          <tr>
            <td>学院</td>
            <td id="personal_academe"></td>
          </tr>
        </table>
      </div>
    </fieldset>
  </div>  
  <div align="center" style="float: left;width: 50%;height: 100%;">
    <fieldset class="layui-elem-field">
      <legend>信息预览</legend>
      <div id="approve_div" class="layui-field-box" style="height: 250px">
      <button class="layui-btn layui-btn-primary layui-btn-sm" id="approve_detail" style="float: right;"><i class="layui-icon">&#xe60a;</i></button>
        <table class="layui-table" id="teacher-info" style="width: 70%">
          <tr>
            <td>课程名称</td>
            <td id="approve_name"></td>
          </tr>
          <tr>
            <td>材料类型</td>
            <td id="approve_type"></td>
          </tr>
          <tr>
            <td>班级</td>
            <td id="approve_class"></td>
          </tr>
        </table>
      </div>
      <div id="approve_error" style="display:none">
      	暂无数据
      </div>
    </fieldset>
  </div>  
  <div align="center" style="float: left;width: 50%;height: 100%;">
    <fieldset class="layui-elem-field">
      <legend>历史记录</legend>
      <div id="receive_div" class="layui-field-box" style="height: 250px">
      <button class="layui-btn layui-btn-primary layui-btn-sm" id="receive_detail" style="float: right;"><i class="layui-icon">&#xe60a;</i></button>
        <table class="layui-table" id="teacher-info" style="width: 70%">
          <tr>
            <td>已交材料</td>
            <td  id="receive_name"></td>
          </tr>
          <tr>
            <td>材料类型</td>
            <td id="receive_type"></td>
          </tr>
          <tr>
            <td>班级</td>
            <td id="receive_class"></td>
          </tr>
        </table>
      </div>
      <div id="receive_error" style="display:none">
     	 暂无数据
      </div>
    </fieldset>
  </div>  
  <!-- <div align="center" style="float: left;width: 50%;height: 100%;">
    <fieldset class="layui-elem-field">
      <legend>数据统计</legend>
      <div class="layui-field-box" style="height: 250px">
      <button class="layui-btn layui-btn-primary layui-btn-sm" id="edit_person" style="float: right;"><i class="layui-icon">&#xe629;</i></button>
        <div id="container" style="height: 250px"></div>
      </div>
    </fieldset>
  </div>   -->
<script src="../plugin/layui-v2.2.5/layui/layui.js"></script>
<script src="../plugin/jquery-3.1.1.min.js"></script>
<script src="../plugin/Highcharts-6.0.7/code/highcharts.js"></script>
<script src="../plugin/Highcharts-6.0.7/code/modules/exporting.js"></script>
<script>
layui.use('table', function(){
  

});

function getUserMsg(){
	$.ajax({ 
    	url: "/CMA/shiro/getUserMsg",
    	contentType: "application/x-www-form-urlencoded",
    	type:"post",
    	dataType : "json",
    	success: function(data){
    		var role = data.role.role;
    		var teacher = data.user;
    		document.getElementById("personal_workId").innerHTML=teacher.workid;
    		document.getElementById("personal_name").innerHTML=teacher.name;
    		document.getElementById("personal_academe").innerHTML=teacher.academeName;
    		$("#user_img").attr('src','../uploadImg/'+teacher.workid+'.png');
        }
	})
};

function getApprpove(){
	$.ajax({ 
    	url: "/CMA/courseDocument/getDocumentByTeacher",
    	contentType: "application/x-www-form-urlencoded",
    	type:"post",
    	data:{
    		page: 1,
    		limit: 1
    	},
    	dataType : "json",
    	success: function(data){
    		console.log(data.data.length);
    		if(data.data.length == 0){
    			$("#approve_div").hide();
    			$("#approve_error").show();
    		}else{
    			var course = data.data[0];
        		document.getElementById("approve_name").innerHTML=course.className;
        		document.getElementById("approve_type").innerHTML=course.documenttype;
        		document.getElementById("approve_class").innerHTML=course.className;
    		} 
        }
      });
}

function getReceive(){
	$.ajax({ 
    	url: "/CMA/courseDocument/getAlSubmitDocument",
    	contentType: "application/x-www-form-urlencoded",
    	type:"post",
    	data:{
    		page: 1,
    		limit: 1
    	},
    	dataType : "json",
    	success: function(data){
    		console.log(data.data[0]);
    		if(data.data.length == 0){
    			$("#receive_div").hide();
    			$("#receive_error").show();
    		}else{
    			var course = data.data[0];
        		document.getElementById("receive_name").innerHTML=course.className;
        		document.getElementById("receive_type").innerHTML=course.documenttype;
        		document.getElementById("receive_class").innerHTML=course.className;
    		} 
        }
      });
}


$(function () {
	getUserMsg();
	getApprpove();
	getReceive();
    $('#container').highcharts({
        chart: {
            plotBackgroundColor: null,
            plotBorderWidth: null,
            plotShadow: false
        },
        title: {
            text: ''
        },
        tooltip: {
            headerFormat: '{series.name}<br>',
            pointFormat: '{point.name}: <b>{point.percentage:.1f}%</b>'
        },
        plotOptions: {
            pie: {
                allowPointSelect: true,
                cursor: 'pointer',
                dataLabels: {
                    enabled: true,
                    format: '<b>{point.name}</b>: {point.percentage:.1f} %',
                    style: {
                        color: (Highcharts.theme && Highcharts.theme.contrastTextColor) || 'black'
                    }
                }
            }
        },
        exporting: {  
            enabled:false       //不显示导出功能
        },  
        credits: {  
            enabled: false     //不显示LOGO 
        },
        series: [{
            type: 'pie',
            name: '材料上交占比',
            data: [
                ['信息学院',   45.0],
                ['兽医学院',       26.8],
                {
                    name: '数学学院',
                    y: 12.8,
                    sliced: true,
                    selected: true
                },
                ['其他',   0.7]
            ]
        }]
    });
    
    $("#edit_person").on("click",function(){
    	parent.openPersonal();
    });
    $("#approve_detail").on("click",function(){
    	parent.approve_detail();
    });
    $("#receive_detail").on("click",function(){
    	parent.receive_detail();
    });
    
    $.ajax({ 
    	url: "/CMA/teacher/getTeacherById",
    	data : {
    		id : "1"
    	},
    	contentType: "application/x-www-form-urlencoded",
    	type:"post",
    	dataType : "json",
    	success: function(result){
    		var teacher = result.data;
    		con = teacher.teacherid;
          }
      });
});

</script>
</body>
</html>